<template>
  <m-layout>
    <mt-header slot="header" title="跟进记录" >
      <mt-button  slot="left" icon="back" @click="handleClose"></mt-button>
    </mt-header>
    <div slot="body" class="add-follow">
      <mt-field class="textarea-box" placeholder="请输入内容（500个字符以内）" type="textarea" :attr="{ maxlength: 500 }"  rows="4" v-model="content"></mt-field>
      <mt-button type="primary" size="large" @click="submit"
      :disabled='!(content)'
      >保存</mt-button>
    </div>
  </m-layout>
</template>

<script>
import saleApi from 'api/sale.js'
import {MessageBox} from 'mint-ui'

export default {
  data () {
    return {
      content: '',
      studentId: ''
    }
  },
  mounted () {
    this.studentId = this.$route.query.student_id
  },
  methods: {
    handleClose () {
      if (this.content) {
        MessageBox.confirm('离开后信息将不保存', '确认离开？').then(action => {
          this.$router.go(-1)
        }).catch(action => {
        })
      } else {
        this.$router.go(-1)
      }
    },
    submit () {
      if (this.content) {
        saleApi.addFollowRecord({studentId: this.studentId, content: this.content}).then((res) => {
          this.$router.replace({path: '/sale/detail/follow', query: {student_id: this.studentId}})
        })
      } else {
        alert('请输入内容')
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.add-follow{
  .textarea-box{
    margin-top: 0.2rem;
  }
  button{
    margin-top: 0.2rem;
  }
}
</style>

<style lang="scss" >
.add-follow{
  textarea{
    resize: none;
    text-align: left;
  }
}
</style>
